import React, { Component } from 'react'
import Utils from '../../utils/utils'
import TableUtils from '../../DBUtils/DBUtils'
import InnerTable from './InnerTable';
import Loading from '../../common/Loading/Loading'
import Logger from '../../utils/Logger'
import {withRouter} from 'react-router-dom'
import {insert, search} from '../../redux/form.redux'
import {connect} from 'react-redux'
import * as types from '../../redux/types'
import './index.scss'


// 启动Logger插件...
const logger = Logger.getLogger('DBTale');
/* 
 * @moduleName: DBTable 出口文件
 * @Desc: 一个table+form页面肯定是 搜索区域 + 表格区域 + page区域 按照这个思路来说table+form要想
 * 成公共的必须要把这三个模块拆开 单独去配置 来应对不同种情况。
 * @Author: djkloop 
 * @Date: 2017-11-24 11:23:42 
 * @Last Modified by: djkloop
 * @Last Modified time: 2017-12-14 13:45:35
 */

@withRouter // 这个入口文件没有props
@connect(state => state.resMessage, {insert,search})
class DBTable extends Component {
  state = {
    // 远处加载shema应该有相对应的状态来控制
    loadingSchema: false,
    // 表单查询配置
    queryObj: {},
    // 表格中要显示的数据
    data:[],
    // 表格是否是loaidng状态
    tableLoading: false,
    // 当前分页状态 默认是1
    currentPage: 1,
    pageSize: 10,
    total: 0,
    update: {},
    resObj:{}
  }

  componentWillMount() {
    // 先处理url
    this.processQueryParams();
    // 然后这时候发起来一个异步函数 但是用async包了一层...
    TableUtils.tryGetSchema(this.props, (res) => {
      this.setState({resObj:TableUtils.updateState(res)}, this.refresh)
    })
  }

  refresh = async(childProps) => {
    const {tableName, inited, queryObj} = this.state.resObj
    // 如果加载schema失败, 就不要查询了
    if (!inited) {
      return;
    }
    await this.props
              .search(
              tableName, 
              {
                queryObj:childProps ? childProps.queryObj : queryObj,
                id:childProps ? childProps.id : void 0,
                pageSize: childProps ? childProps.pageSize : this.state.pageSize,
                page:childProps ? childProps.page : this.state.currentPage
              });
    //message.success('查询成功');
    this.props.parentProps(childProps ? childProps.pageSize : this.state.pageSize,)
    if (this.props.resMessage.code === types.SUCCESS_CODE) {
      this.setState({
        data: this.props.resMessage.data
      })
    } else {
    }
  };


  // 这个函数 不知道干啥的？
  processQueryParams() {
    // --> 这是原作者提供的方法...我这里没有理解或许是url上...传了一些特殊的参数做一些特殊的处理？ 
    // 这个方法可以算作一个后门, 甚至可以传入一些querySchema中没配置的参数, 只要后端能处理就可以
    const params = Utils.getAllQueryParams();
    // 如果url上有参数
    if (Object.keys(params).length > 0) {
      // 
      this.setState({
        queryObj: Object.assign({}, this.state.queryObj, params)
      })
    }
  }

  handleFormSubmit = async (queryObj) => {
    logger.debug('handleFormSubmit, queryObj = %o', queryObj);
    this.props.parentProps(this.state.pageSize)
    await this.props.insert(this.tableName,queryObj);
    if (this.props.resMessage.code === types.SUCCESS_CODE) {
      console.log(this.props.resMessage)
    } else {
    }
  };

  componentWillReceiveProps = (nextProps) => {
    this.Update = nextProps.resMessage.update;
    this.TableData =nextProps.resMessage;
    this.setState({
      data:nextProps.resMessage.data,
      update: nextProps.resMessage.update
    })
  }


  shouldComponentUpdate(nextProps, nextState) {
    // console.log('shouldComponentUpdate', nextProps)
    // if(nextProps.updateMessage !== void 0) {
    //   this.setState({
    //     data: nextProps.resMessage.data,
    //     update: nextProps.resMessage.update
    //   })
    // }
    // console.log('shouldComponentUpdate', nextState)
    return true
  }
  
  
  render() {
    const {dataSchema, tableName} = this.state.resObj
    // const hasSelected = selectedRowKeys.length > 0
    return this.TableData === void 0 || this.state.loadingSchema === void 0 || this.state.data === void 0 ? <Loading cls="danger" tip={`远程 "${this.props.match.params.tableName}" TableSchema正在加载...`} delay={1000} size="large" /> : (
      <div>
        <InnerTable refresh={this.refresh} data={this.state.data} schema={dataSchema} tableName={tableName}></InnerTable>
      </div>
    )
  }
}

export default DBTable
